import { PureComponent } from 'react'
import classNames from 'classnames'
import { Button, Spin } from 'antd'
import styles from './index.module.less'

export default class ErrorMod extends PureComponent {
  static defaultProps = {
    horizontal: false,
    showLoading: true,
    showBtn: true,
    btnText: '刷新一下',
    height: '240px',
    onClick: () => {}
  }

  render() {
    const { horizontal, height, showLoading, showBtn, btnText, onClick, children, className } =
      this.props

    const clazz = classNames(styles.container, styles.error, className, {
      [styles.horizontal]: horizontal
    })

    return (
      <div className={clazz} style={{ height }}>
        {showLoading ? (
          <div className={styles.loadingbox}>
            <Spin />
          </div>
        ) : null}
        <div className={styles.desc}>{children || '抱歉，数据先生开小差了~'}</div>
        {showBtn ? (
          <div className={styles.action}>
            <Button onClick={onClick} type={horizontal ? 'link' : 'primary'}>
              {btnText}
            </Button>
          </div>
        ) : null}
      </div>
    )
  }
}
